<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<header id="navbar">
    <div id="navbar-container" class="boxed">
        <div class="navbar-header">
            <a href="#" class="navbar-brand">
                <i class="psi-lion" style="float: left;margin: 11px 16px;"></i>
                <div class="brand-title">
                    <span class="brand-text">9090分销</span>
                </div>
            </a>
        </div>
        <div class="navbar-content clearfix">
            <ul class="nav navbar-top-links pull-left">
                <li class="tgl-menu-btn">
                    <a class="mainnav-toggle" href="#">
                        <i class="demo-pli-view-list"></i>
                    </a>
                </li>
                <li class="dropdown">
                    <a href="#" data-toggle="dropdown" class="dropdown-toggle">
                        <i class="demo-pli-bell"></i>
                        <span class="badge badge-header badge-danger"></span>
                    </a>
                    <div class="dropdown-menu dropdown-menu-md">
                        <div class="pad-all bord-btm">
                            <p class="text-semibold text-main mar-no">您有9条信息未读.</p>
                        </div>
                        <div class="nano scrollable">
                            <div class="nano-content">
                                <ul class="head-list">
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <p class="pull-left">项目进度</p>
                                                <p class="pull-right">70%</p>
                                            </div>
                                            <div class="progress progress-sm">
                                                <div style="width: 70%;" class="progress-bar">
                                                    <span class="sr-only">70% 完成</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <p class="pull-left">完成情况</p>
                                                <p class="pull-right">10%</p>
                                            </div>
                                            <div class="progress progress-sm">
                                                <div style="width: 10%;" class="progress-bar progress-bar-warning">
                                                    <span class="sr-only">10% 完成</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a class="media" href="#">
                                            <span class="badge badge-success pull-right">90%</span>
                                            <div class="media-left">
                                                <i class="demo-pli-data-settings icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <div class="text-nowrap">硬盘使用情况</div>
                                                <small class="text-muted">50 分钟以前</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a class="media" href="#">
                                            <div class="media-left">
                                                <i class="demo-pli-file-edit icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <div class="text-nowrap">您有未完成任务</div>
                                                <small class="text-muted">1小时以前</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a class="media" href="#">
                                            <span class="label label-danger pull-right">新</span>
                                            <div class="media-left">
                                                <i class="demo-pli-speech-bubble-7 icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <div class="text-nowrap">短消息</div>
                                                <small class="text-muted">8小时以前</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a class="media" href="#">
                                            <div class="media-left">
                                                <i class="demo-pli-add-user-plus-star icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <div class="text-nowrap">New User Registered</div>
                                                <small class="text-muted">4 minutes ago</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="bg-gray">
                                        <a class="media" href="#">
                                            <div class="media-left">
                                                <img class="img-circle img-sm" alt="Profile Picture"
                                                     src=" ${pageContext.request.contextPath}/common/img/profile-photos/9.png">
                                            </div>
                                            <div class="media-body">
                                                <div class="text-nowrap">周杰伦给你发了一条消息</div>
                                                <small class="text-muted">30分钟以前</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="bg-gray">
                                        <a class="media" href="#">
                                            <div class="media-left">
                                                <img class="img-circle img-sm" alt="Profile Picture"
                                                     src=" ${pageContext.request.contextPath}/common/img/profile-photos/3.png">
                                            </div>
                                            <div class="media-body">
                                                <div class="text-nowrap">佟丽娅给你发了一条消息</div>
                                                <small class="text-muted">40分钟以前</small>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="pad-all bord-top">
                            <a href="#" class="btn-link text-dark box-block">
                                <i class="fa fa-angle-right fa-lg pull-right"></i>查看所有信息
                            </a>
                        </div>
                    </div>
                </li>
                <li class="mega-dropdown">
                    <a href="#" class="mega-dropdown-toggle">
                        <i class="demo-pli-layout-grid"></i>
                    </a>
                    <div class="dropdown-menu mega-dropdown-menu">
                        <div class="row">
                            <div class="col-sm-4 col-md-3">
                                <ul class="list-unstyled">
                                    <li class="dropdown-header"><i class="demo-pli-file icon-fw"></i> 状态</li>
                                    <li><a href="#">状态1</a></li>
                                    <li><a href="#">状态1</a></li>
                                    <li><a href="#">状态1</a></li>
                                    <li><a href="#">状态1</a></li>
                                    <li><a href="#" class="disabled">状态1</a></li>
                                </ul>

                            </div>
                            <div class="col-sm-4 col-md-3">
                                <ul class="list-unstyled">
                                    <li class="dropdown-header"><i class="demo-pli-mail icon-fw"></i> 邮件</li>
                                    <li><a href="#">发邮件</a></li>
                                    <li><a href="#">查看未读</a></li>
                                    <li><a href="#">进入邮箱</a></li>
                                </ul>
                                <p class="pad-top mar-top bord-top text-sm">
                                    这里是邮箱系统这里是邮箱系统这里是邮箱系统这里是邮箱系统这里是邮箱系统,这里是邮箱系统这里是邮箱系统.</p>
                            </div>
                            <div class="col-sm-4 col-md-3">
                                <ul class="list-unstyled">
                                    <li>
                                        <a href="#" class="media mar-btm">
                                            <span class="badge badge-success pull-right">90%</span>
                                            <div class="media-left">
                                                <i class="demo-pli-data-settings icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <p class="text-semibold text-dark mar-no">容量剩余</p>
                                                <small class="text-muted">这是一段描述</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" class="media mar-btm">
                                            <div class="media-left">
                                                <i class="demo-pli-support icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <p class="text-semibold text-dark mar-no">容量剩余</p>
                                                <small class="text-muted">这里是邮箱系统这里是邮箱系统</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" class="media mar-btm">
                                            <div class="media-left">
                                                <i class="demo-pli-computer-secure icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <p class="text-semibold text-dark mar-no">这一个一额</p>
                                                <small class="text-muted">这里是邮箱系统这里是邮箱系统</small>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" class="media mar-btm">
                                            <div class="media-left">
                                                <i class="demo-pli-map-2 icon-2x"></i>
                                            </div>
                                            <div class="media-body">
                                                <p class="text-semibold text-dark mar-no">本地</p>
                                                <small class="text-muted">这里是邮箱系统这里是邮箱系统</small>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div class="col-sm-12 col-md-3">
                                <p class="dropdown-header"><i class="demo-pli-file-jpg icon-fw"></i>相册</p>
                                <ul class="list-unstyled list-inline text-justify">

                                    <li class="pad-btm">
                                        <img src="${pageContext.request.contextPath}/common/img/thumbs/mega-menu-2.jpg"
                                             alt="thumbs">
                                    </li>
                                    <li class="pad-btm">
                                        <img src=" ${pageContext.request.contextPath}/common/img/thumbs/mega-menu-3.jpg"
                                             alt="thumbs">
                                    </li>
                                    <li class="pad-btm">
                                        <img src=" ${pageContext.request.contextPath}/common/img/thumbs/mega-menu-1.jpg"
                                             alt="thumbs">
                                    </li>
                                    <li class="pad-btm">
                                        <img src=" ${pageContext.request.contextPath}/common/img/thumbs/mega-menu-4.jpg"
                                             alt="thumbs">
                                    </li>
                                    <li class="pad-btm">
                                        <img src=" ${pageContext.request.contextPath}/common/img/thumbs/mega-menu-5.jpg"
                                             alt="thumbs">
                                    </li>
                                    <li class="pad-btm">
                                        <img src=" ${pageContext.request.contextPath}/common/img/thumbs/mega-menu-6.jpg"
                                             alt="thumbs">
                                    </li>
                                </ul>
                                <a href="#" class="btn btn-sm btn-block btn-default">浏览相册</a>
                            </div>
                        </div>
                    </div>
                </li>
            </ul>
            <ul class="nav navbar-top-links pull-right">
                <li id="dropdown-user" class="dropdown">
                    <a href="#" data-toggle="dropdown" class="dropdown-toggle text-right">
                                <span class="pull-right">
                                    <!--<img class="img-circle img-user media-object" src="img/profile-photos/1.png" alt="Profile Picture">-->
                                    <i class="demo-pli-male ic-user"></i>
                                </span>
                        <div class="username hidden-xs">${sysUser.flName}</div>
                    </a>

                    <div class="dropdown-menu dropdown-menu-md dropdown-menu-right panel-default">
                        <!--
                        <div class="pad-all bord-btm">
                            <p class="text-main mar-btm"><span class="text-bold">已用750GB</span> 总共1000GB</p>
                            <div class="progress progress-sm">
                                <div class="progress-bar" style="width: 70%;">
                                    <span class="sr-only">70%</span>
                                </div>
                            </div>
                        </div>
                        -->
                        <ul class="head-list">
                            <li>
                                <a onclick="showMeInfo()" href="javascript:void(0);">
                                    <i class="demo-pli-male icon-lg icon-fw"></i> 个人主页
                                </a>
                            </li>
                            <li>
                                <a href="javascript:void(0);" data-toggle="modal" data-target="#homeDetail"
                                   class="active"><i class="demo-pli-gear icon-lg icon-fw"></i> 修改密码</a>
                            </li>
                            <!--
                            <li>
                                <a href="#">
                                    <span class="badge badge-danger pull-right">9</span>
                                    <i class="demo-pli-mail icon-lg icon-fw"></i> 新消息
                                </a>
                            </li>

                            <li>
                                <a href="#">
                                    <i class="demo-pli-information icon-lg icon-fw"></i> 帮助
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <i class="demo-pli-computer-secure icon-lg icon-fw"></i> 锁屏
                                </a>
                            </li>
                            -->
                        </ul>
                        <div class="pad-all text-right">
                            <a href="${pageContext.request.contextPath}/sysUser/logout" class="btn btn-primary">
                                <i class="demo-pli-unlock"></i> 登出
                            </a>
                        </div>
                    </div>
                </li>
                <li>
                    <a href="#" class="aside-toggle navbar-aside-icon">
                        <i class="pci-ver-dots"></i>
                    </a>
                    <span class="pull-right badge badge-danger" style="position: absolute; right: 0px; top: 0px;"
                          id="messageCount"></span>
                </li>
            </ul>
        </div>
    </div>
</header>